/**
 * @function
 * @name moveTo
 * @description Move element to a destination (desktop/mobile).
 * @memberof HQ.components
 *
 * @param {object} enhancementRoot - The current DOM element.
 * @example
 * <div class="js-move-to-desktop-location">...</div>
 * <div class="js-move-to-mobile-location">...</div>
 *
 * <div class="enhance"
 *      data-enhance="move-to"
 *      data-parent-container="<!--#echo var='parentContainer'-->"
 *      data-desktop=".js-move-to-desktop-location"
 *      data-mobile=".js-move-to-mobile-location">...</div>
 */
HQ.components.moveTo = function (enhancementRoot) {

    $(this.elems).each(function () {

        // GLOBAL VARS
        // ==============================================================
        var $inst            = $(this);
        var $parentContainer = $inst.data('parent-container') ? $($inst.data('parent-container')) : '';

        // Device Name
        var device = {
            mobile   : "mobile",
            notMobile: "notmobile"
        };
        var currentDevice = device.notMobile;

        /**
         * Destination (desktop/mobile)
         *
         * Insert properties:
         * appendto     - Insert every element in the set of matched elements to the end of the target.
         * prependto    - Insert every element in the set of matched elements to the beginning of the target.
         * insertafter  - Insert every element in the set of matched elements after the target.
         * insertbefore - Insert every element in the set of matched elements before the target.
         */

        // Element go to on desktop device (class or id name with symbol [. or #]).
        var $desktopGoTo  = $inst.data('desktop') ? $($inst.data('desktop'), $parentContainer) : '';

        // Element go to on mobile device (class or id name with symbol [. or #]).
        var $mobileGoTo   = $inst.data('mobile') ? $($inst.data('mobile'), $parentContainer) : '';

        // Desktop move To Action (default: insertBefore).
        var desktopInsert = $inst.data('desktop-insert') ? $inst.data('desktop-insert') : 'insertafter';

        // Mobile move To Action (default: insertBefore)
        var mobileInsert  = $inst.data('mobile-insert') ? $inst.data('mobile-insert') : 'insertafter';

        // FUNCTIONS
        // ==============================================================

        function action(p_destination, p_insert){
            if(p_insert === "insertafter"){
                $inst.insertAfter(p_destination);

            }else if(p_insert === "appendto"){
                $inst.appendTo(p_destination);

            }else if(p_insert === "prependto"){
                $inst.prependTo(p_destination);

            }else{
                $inst.insertBefore(p_destination);
            }
        }

        function moveTo(){
            if(currentDevice === 'mobile'){
                action($mobileGoTo, mobileInsert);

            }else{
                action($desktopGoTo, desktopInsert);
            }
        }

        // MEDIAS QUERIES
        // ==============================================================
        var _enquireMobileHandler = {
            match: function () {
                currentDevice = device.mobile;
                moveTo();
            }
        };
        enquire.register(HQ.mediaqueries.MOBILE, _enquireMobileHandler);

        var _enquireNotMobileHandler = {
            match: function () {
                currentDevice = device.notMobile;
                moveTo();
            }
        };
        enquire.register(HQ.mediaqueries.NOT_MOBILE, _enquireNotMobileHandler, true);

    });
};